스코프는 변수, 함수, 객체 등 식별자(identifier)에 접근하거나 참조할 수 있는 유효 범위를 의미한다. 즉, 코드가 특정 변수에 접근할 수 있는지 여부를 결정하는 규칙이다. 자바스크립트의 스코프는 주로 **렉시컬 스코프(Lexical Scope)**를 따르는데, 이는 함수가 어디서 선언되었는지에 따라 스코프가 결정된다는 의미이다. 주요 스코프 종류는 다음과 같다. 스코프는 변수의 생명주기와 접근성으 관리하며, 이름추돌을 방지하고 코드의 모듈서을 높이는 데 중요한 역할을 한다.

스코프의 종류#

1. 전역 스코프(Global Scope)

   코드의 가장 바깥 영역이다. 여기서 선언된 변수나 함수는 코드 어디에서든 접근이 가능하다. 브라우저 환경에서는 window객체가 전역 객체 역할을 한다.

2. 함수 스코프(Function Scope)

   함수 내부에서 선언된 변수는 해당 함수 내에서만 유효하다. var키웓로 선언된 변수가 이 스코프 규칙을 따른다.

3. 블록스코프(Bllank Scope)

   코드 블록({}) 내에서 선언된 변수는 해당 블록 내에서만 유효하다. let과 const 키워드로 서언된 변수가 이 스코프 규칙을 따른다. if문, for문, while문 등의 코드 블록이 해당된다.

전역 스코프의 장단점#

전역 스코프에 변수나 함수를 선언하면 코드 어디서든 쉽게 접근할 수 있다는 장점이 있다. 애플리케이션 전체에서 공유되어야 하는 상태나 유틸리티 함수 등에 사용될 수 있다.

전역 스코프의 오염을 최소화하는 것이 좋은 프로그래밍 습관이다. 모듈 패턴, IIFE(즉시 실행 함수 표현식), ES6모듈 등을 사용하여 변수의 스코프를 제한하고, 필요한경우에만 최소한의 전역 변수를 사용하는 것이 바람직하다.

장점#

1. 접근성: 코드 어디서든 참조 가능하다.

2. 상태 유지: 애플리케이션 생명주기 동안 값이 유지될 수 있다.

단점#

1. 이름충돌(Namespace Pollution): 다른 스크립트나 라이브러리에서 동일한 이름의 전역 변수/함수를 사용하면 충돌이 발생하여 예기치 않은 결과를 초래할 수 있다. 특히 규모가 큰 프로젝트나 여러 개발자가 협업하는 경우 문제가 심각해질 수 있다.

2. 유지보수 어려움: 전역변수는 코드 어느 부분에서든 변경될 수 있어, 값의 변경을 추적하고 디버깅하기 어렵게 만든다. 이는 코드의 의존성을 높이고 예측가능성을 떨어뜨린다.

3. 메모리: 전역 변수는 애플리케이션이 종료될 때까지 메모리에 남아있어, 불필요한 메모리 소비를 유발할 수 있다.

4. 함묵적 의존성: 코드가 명시적인 전달 없이 전역 상태에 의존하게 되어 모듈성과 재사용성을 저해할 수 있다.

렉시컬 스코프(Lexical Scope)#

렉시컬 스코프(Lexical Scope)는 프로그래밍 언어에서 변수의 유효 범위를 결정하는 방식으로, 코드가 작성된 구조에 따라 변수의 접근성이 결정된다.

렉시컬 스코프는 스코프 체인과 클로저(Closure)란 무엇인가의 작동 방식을이해하는 데 있어 핵심적인 원리이다. 자바스크립트 엔진은 코드가 실행될 때가 아니라, 코드가 작성될 때(컴파일 또는 파싱 시점)변수와 함수가 어디에 위치하는지를 기준으로 스코프를 결정한다. 이것으 렉시컬 스코프(정적 스코프)이다. 따라서 함수가 호출되는 위치와 관계없이, 함수는 자신이 선언된 위치의 스코프와 그 상위 스코프들에 접근할 수 있다. 스코프 체인은 바로 이 렉시컬 구조를 따라 형성되며, 클로저는 함수가 자신의 렉시컬 환경(선언 시점의 스코프)을 기억하는 능력에서 비롯된다.

만약 자바스크립트가 동적 스코프(함수가 호출된 위치에 따라 스코프가 결정되는 방식)을 사용했다면, 코드의 동작을 에측하기 훨씬 어려웠을 것이다. 렉시컬 스코프 덕분에 개발자는 코드를 읽는것 만으로도 변수의 유효 범위를 상대적으로 쉽게 파악할 수 있고, 이는 코드의 안정성과 예측 가능성을 높여준다.

렉시컬 스코프의 주요 특징#

1. 코드가 작성된 위치에 따라 변수의 접근 범위가 정적으로 결정된다.
2. 내부 함수는 자신이 정의된 외부 함수의 변수에 접근할 수 있다.
3. 반대로 외부 함수는 내부 함수의 변수에 접근할 수 없다.

스코프 체인(Scope Chain)#

스코프 체인은 자바스크립트 엔진이 식별자(변수, 함수 등)을 찾는 메커니즘이다. 특정 스코프 내에서 변수를 참조할 때, 엔진은 먼저 현재 스코프에서 해당 변수를 찾는다. 만약 찾지 못하면, **상위 스코프(자신을 포하하는 외부 스코프)**로 이동하여 다시 찾는다. 이 과정을 젼역 스코프에 도달할 때까지 반복한다. 이처럼 현재 스코프에서 시작하여 상위 스코프로 연속적으로 연결된 것을 스코프 체인이라고 한다. 이 체인은 코드가 작성될 때의 렉시컬 구조(어디에 선언되었는지)에 의해 결정된다.

스코프 체인의 내부 함수가 외부 함수의 변수에 접근할 수 있는 원리를 설명하며, 클로저(Closure) 개념의 기반이 된다.